@use "sass:map";

$nil-header-height: 50px;
$nil-app-nav-height: 34px;

$nil-padding-1: 8px;
$nil-padding-2: 16px;

$nil-app-background: #eff1f4;

$nil-app-logo-color: #23a9f2;
$nil-app-logo-background: #fff;

$nil-menu-children-background: #1f2d3d;
$nil-menu-children-hover-background: #001528;
$nil-menu-item-hover-background: #001528;
$nil-menu-menu-background: #304156;
$nil-menu-sub-menu-title-color: #f8f8f8;
$nil-menu-item-hover-color: #23a9f2;

$nil-color-primary: #23a9f2;
$nil-color-success: #67c23a;
$nil-color-warning: #e6a23c;
$nil-color-danger: #f56c6c;
$nil-color-error: #f56c6c;
$nil-color-info: #909399;

@import "./ele.scss";

:root {
  --nil-menu-menu-background: #{$nil-menu-menu-background};
  --nil-menu-item-hover-background: #{$nil-menu-item-hover-background};
  --nil-menu-item-hover-color: #{$nil-menu-item-hover-color};
  --nil-menu-children-background: #{$nil-menu-children-background};
  --nil-menu-children-hover-background: #{$nil-menu-children-hover-background};
  --nil-menu-sub-menu-title-color: #{$nil-menu-sub-menu-title-color};

  --nil-app-logo-color: #{$nil-app-logo-color};
  --nil-app-logo-background: #{$nil-app-logo-background};

  // element 覆盖样式
  --el-color-white: #{$color-white};
  --el-color-black: #{$color-black};

  --el-color-primary: #{$color-primary};

  // get rgb
  @each $type in (primary, success, warning, danger, error, info) {
    @include set-css-color-rgb($type);
  }

  @for $i from 1 through 9 {
    @include set-css-color-type-light("primary", $i);
  }
  --el-color-primary-dark-2: #{map.get($colors, "primary", "dark-2")};

  // --el-color-#{$type}
  // --el-color-#{$type}-light-{$i}
  @each $type in (success, warning, danger, error, info) {
    @include set-css-color-type($type);
  }
}
